<template>
  <view class="">
    <view class="indexeditlist">
      <view class="indexedititem">
        <text>父级</text>
        <u-select
          @confirm="confirm"
          mode="single-column"
          v-model="show"
          :list="categoryList"
        ></u-select>
        <!-- 选中的name值 -->
        <!-- <text>{{ id }}</text> -->
        <text>{{ name }}</text>
        <u-button v-model="show" @click="selectParent">请选择</u-button>
      </view>
      <view class="indexedititem">
        <text>分类名称</text>
        <input type="text" v-model="addname" placeholder="请输入分类名称" />
      </view>
      <view class="indexedititem">
        <text>排序</text>
        <input type="number" v-model="weight" placeholder="请输入排序" />
      </view>
    </view>
    <view class="indexbtn" @click="handleEdit"> 确认提交 </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      // 父级列表
      categoryList: [],
      //   获取的分类列表
      list: {},

      show: false,
      //   选中的name值
      name: "",
      //   选中的id
      id: "",
      //   父级id
      pid: "",
      //   权重
      weight: "",
      //   分类名称
      addname: "",
    };
  },
  methods: {
    //   修改提交
    handleEdit() {
      console.log("修改提交");
      uni.request({
        url: "http://gxyckf.1qit.com/api/admin.category/edit", //仅为示例，并非真实接口地址。
        method: "post",
        data: {
          id: this.id,
          pid: this.pid,
          name: this.addname,
          weigh: this.weight,
        },
        method: "POST",

        header: {
          token: uni.getStorageSync("token"),
        },
        success: (res) => {
          console.log(res.data);
          if (res.data.code == 1) {
            this.data = {};
            uni.navigateTo({
              url: "/pages/classification/classification",
            });
          }
        },
      });
    },
    //   打开选择父级
    selectParent() {
      this.show = true;
      //   查询父商品列表
      uni.request({
        url: "http://gxyckf.1qit.com/api/admin.category/addcategorylist", //仅为示例，并非真实接口地址。
        data: {},
        method: "GET",

        header: {
          token: uni.getStorageSync("token"),
        },
        success: (res) => {
          if (res.data.code == 1) {
            console.log(res.data);
            var list = [];
            for (var i in res.data.data) {
              var str = res.data.data[i].name;
              str = str.replace(/&nbsp;/gi, "");
              var obj = {};
              obj.value = res.data.data[i].id;
              obj.label = str;
              obj.pid = res.data.data[i].pid;
              list.push(obj);
            }
            this.categoryList = list;
          }
        },
      });
    },
    //   选择商品父级
    confirm(e) {
      console.log(e);
      e.map((item) => {
        console.log(item);
        this.name = item.label;
        this.pid = item.value;
      });
    },
  },
  onLoad(option) {
    console.log(option);
    this.id = option.id;
    // 获取要修改的数据
    uni.request({
      url: "http://gxyckf.1qit.com/api/admin.category/edit", //仅为示例，并非真实接口地址。
      method: "GET",
      data: {
        id: this.id,
      },
      header: {
        token: uni.getStorageSync("token"),
      },
      success: (res) => {
        if (res.data.code == 1) {
          console.log(res.data);
          this.name = res.data.data.name;
          this.addname = res.data.data.name;
          this.weight = res.data.data.weigh;
        }
      },
    });
  },
  mounted() {
    uni.request({
      url: "http://gxyckf.1qit.com/api/admin.category/addcategorylist", //仅为示例，并非真实接口地址。
      data: {},
      method: "GET",

      header: {
        token: uni.getStorageSync("token"),
      },
      success: (res) => {
        if (res.data.code == 1) {
          console.log(res.data);
          var list = [];
          for (var i in res.data.data) {
            var str = res.data.data[i].name;
            str = str.replace(/&nbsp;/gi, "");
            var obj = {};
            obj.value = res.data.data[i].id;
            obj.label = str;
            obj.pid = res.data.data[i].pid;
            list.push(obj);
          }
          this.categoryList = list;
        }
      },
    });
  },
};
</script>

<style>
.u-hairline-border:after {
  border: 0 !important;
}
.indexeditlist {
  width: 90%;
  margin: 4% 5%;
}
.indexedititem {
  border-bottom: 1px solid #e6e6e6;
  padding: 5% 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.indexedititem text {
  width: 160rpx;
  color: #313131;
}
.indexedititem input {
  font-size: 28rpx;
  width: 500rpx;
  color: #828282;
  text-align: right;
}
.indexbtn {
  width: 80%;
  margin: 2% 10%;
  text-align: center;
  background: red;
  font-size: 32rpx;
  line-height: 3;
  color: #fff;
  border-radius: 60rpx;
  margin-top: 100rpx;
}
</style>
